<template>
  <div>
    <el-button
      type="primary"
      v-for="i in $store.state.user.menulist[this.$route.path]"
      :key="i.id"
      @click="btn(i.code)"
      v-if="i.statusName == '启用'"
    >
      {{ i.name }}
    </el-button>
    <div v-if="tableData">
      <!-- <el-table :data="tableData" style="width: 100%" height="300" @cell-click="celltable" :highlight-current-row='true'>
              <el-table-column type="expand"> -->
      <el-table :data="tableData" style="width: 100%" margin-bottom="20px" row-key="id" border   :tree-props="{children:'children'}" @cell-click="celltable">
        <el-table-column prop="fullname" label="部门全称"  >
        </el-table-column>
        <el-table-column prop="simplename" label="部门简称"  >
        </el-table-column>
        <el-table-column prop="id" label="当前部门id"> </el-table-column>
      </el-table>
    </div>

    <!-- 功能组件 -->
  <add :type='buttontype.deptAdd' :fun='showbtn' tname='deptAdd'  :tablerow='tablerow'></add>
    <!--   <mgredit :type='buttontype.mgrEdit' :fun='showbtn' tname='mgrEdit' :tablerow='tablerow'></mgredit>
    <mgrdelete :type='buttontype.mgrDelete' :fun='showbtn' tname='mgrDelete' :tablerow='tablerow'></mgrdelete>
    <setrole :type='buttontype.mgrSetRole' :fun='showbtn' tname='mgrSetRole' :tablerow='tablerow'></setrole>
     -->
    <!-- 功能组件结束 -->
  </div>
</template>
<script>
import { http, deptlist } from "../../api/api.js";
 import add from './add.vue'
// import mgredit from './mgredit.vue'
// import mgrdelete from './mgrdelete.vue'
// import setrole from './setrole.vue'
export default {
  data() {
    return {
      tableData: "", //用户列表数据
      buttontype: {
        //功能对话框状态
        deptAdd: false, //添加部门
        mgrEdit: false, //修改用户
        mgrDelete: false, //删除用户
        mgrSetRole: false, //分配角色
      },
      tablerow: "", //当前选中的用户
    };
  },
  mounted() {
    this.getuserlist(1);
  },
   components:{
     add,
  //     mgredit,
  //     mgrdelete,
  //     setrole
   },
  methods: {
    //点击选中的用户
    celltable(row) {
      this.tablerow = row;
      console.log(row);
    },
    //对话框关闭回调
    showbtn(type) {
      this.buttontype[type] = false;
      this.getuserlist();
      this.tablerow = "";
    },
    //统一管理按钮点击事件
    btn(a) {

      if (a == "deptAdd") {
        this.buttontype[a] = true;
      } else {
        if (this.tablerow == "") {
          this.$message.error("请选择要操作的用户");
        } else {
          this.buttontype[a] = true        }
      }
    },

    //获取部门信息列表
    getuserlist() {
      this.$http.get(http + deptlist).then(
        (data) => {
          if (data.data.msg == "成功") {
            this.tableData = data.data.data;

            this.total = data.data.data.total;
          } else {
            this.$message.error(data.data.message);
          }
        },
        (err) => {
          this.$message.error(err.data.message);
        }
      );
    },
  },
};
</script>
<style lang="">
.demo-table-expand {
  font-size: 0;
}
.demo-table-expand label {
  width: 90px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
  width: 50%;
}
</style>